<template>
  <div class="card">
    <div class="card-header">关联的空间</div>
    <div class="card-content custom-table easy-container">
      <router-link :to="`/spaces/${space.id}`" class="flex">
        <el-avatar :src="space.avatar" shape="square" class="shrink-0 m-r-10" />
        <div class="flex flex-wrap align-items-center" style="overflow: hidden">
          <div class="title line1" :title="space.title">{{ space.title }}</div>
          <div v-if="space.desc" class="info line2" :title="space.desc">{{ space.desc }}</div>
        </div>
      </router-link>
    </div>
  </div>
</template>

<script>
import { mapState } from 'vuex';
import Settings from './related-spaces-settings'; // 已经取消了

export default {
  name: 'related-spaces', // 关联的空间
  components: { Settings },
  computed: {
    ...mapState({ curGroup: 'currentGroup' }),
    space() { return this.curGroup.space; },
  },
};
</script>

<style></style>
